<template>
  <div class="login">
    <div class="header">
      <h1>用户登录</h1>
    </div>
    <div class="form-group">
      <label for>用户名</label>
      <input
        type="email"
        class="form-control"
        name="email"
        placeholder="请输入用户名"
        autofocus
        v-model="dataForm.username"
      />
    </div>
    <div class="form-group">
      <label for>密码</label>
      <a class="pull-right" href>忘记密码？</a>
      <input
        type="password"
        class="form-control"
        name="password"
        placeholder="请输入密码"
        v-model="dataForm.password"
      />
    </div>
    <div class="checkbox">
      <label>
        <input type="checkbox" />记住密码
      </label>
    </div>
    <button type="button" class="btn btn-success btn-block" @click="login">登录</button>
    <div class="message">
      <p>
        没有账号?
        <router-link to="/register">点击创建</router-link>
      </p>
    </div>
  </div>
</template>
<script>
import { Toast } from "mint-ui";
import { Login } from "@/apis/data";
export default {
  data() {
    return {
      dataForm: {},
    };
  },
  methods: {
    login() {
      var dataForm = this.dataForm;
      Login(dataForm).then(res => {
        var data = res.data;
        if (data.code == 0) {
          this.$store.commit("getUser",data.session)
          Toast({
            message: "登录成功",
            position: "middle",
            duration: 1000,
            iconClass: "glyphicon glyphicon-ok"
          });
          this.$router.push("/students");
        } else if (data.code == 2) {
          Toast({
            message: "密码不能为空",
            position: "middle",
            duration: 1000,
            iconClass: "glyphicon glyphicon-remove"
          });
          return false;
        } else if (data.code == 4) {
          Toast({
            message: "用户名长度必须为6-16位",
            position: "middle",
            duration: 1000,
            iconClass: "glyphicon glyphicon-remove"
          });
          return false;
        } else if (data.code == 5) {
          Toast({
            message: "密码长度必须为6-16位",
            position: "middle",
            duration: 1000,
            iconClass: "glyphicon glyphicon-remove"
          });
          return false;
        } else if (data.code == 9) {
          Toast({
            message: "用户名或密码错误！",
            position: "middle",
            duration: 1000,
            iconClass: "glyphicon glyphicon-remove"
          });
          return false;
        }
      });
    }
  }
};
</script>
<style scoped>
.login {
  width: 300px;
  margin: 0 auto;
}
</style>
